<template>
  <div>
    <!-- 
      动态设置style
      语法： :style="{ css属性名：变量 }"
      
      注意：串烧法命名的css属性名，需要用引号引起来，或者改为小驼峰写法
     -->
    <!-- <h1 :style="{ color: redStr,'font-size': size }">hello vue</h1> -->
    <h1 :style="{ color: redStr,fontSize: size }">hello vue</h1>
  </div>
</template>

<script>
export default {
  data(){
    return {
      redStr: 'red',
      size: "12px"
    }
  }
}
</script>

<style>

</style>